<template>
	<view style="background-color: #f1f1f1; height: 100vh;">
		<view class="order_title">
			
		</view>
		<fui-tabs :tabs="tabs" :short="false" @change="change" selectedColor="orange"sliderBackground="orange">
		</fui-tabs>
		
		<view v-if="current==0">
			<view class="allone" v-for="item in baseInfoList">
				<view>
					<image :src="item.goodsPic" mode="" style="width: 240rpx; height: 210rpx;"></image>
				</view>
				<view class="ps">
					<p style="color:black;font-size:18px;width: 450rpx; overflow: hidden;white-space: nowrap;text-overflow: ellipsis;">{{item.goodsName}}</p>
					<p style="color:#999AAA;font-size:15px">下单时间：{{item.orderTime}}</p>
					<p style="color:#999AAA;font-size:15px">数量：*{{item.goodsNum}}</p>
					<p style="color:#999AAA;font-size:15px">总价：{{item.sumPrice}}</p>
				</view>
				
			</view>
			
		</view>
		<view v-if="current==1">
			<view class="allone" v-for="item in baseInfoList">
				<view>
					<image :src="item.goodsPic" mode="" style="width: 240rpx; height: 210rpx;"></image>
				</view>
				<view class="ps">
					<p style="color:black;font-size:18px">{{item.goodsName}}</p>
					<p style="color:#999AAA;font-size:15px">下单时间：{{item.orderTime}}</p>
					<p style="color:#999AAA;font-size:15px">数量：*{{item.goodsNum}}</p>
					<p style="color:#999AAA;font-size:15px">总价：{{item.sumPrice}}</p>
				</view>
			</view>
		</view>
		<view v-if="current==2">
				<view>
					<image :src="item.goodsPic" mode="" style="width: 240rpx; height: 210rpx;"></image>
				</view>
				<view class="ps">
					<p style="color:black;font-size:18px">{{item.goodsName}}</p>
					<p style="color:#999AAA;font-size:15px">下单时间：{{item.orderTime}}</p>
					<p style="color:#999AAA;font-size:15px">数量：*{{item.goodsNum}}</p>
					<p style="color:#999AAA;font-size:15px">总价：{{item.sumPrice}}</p>
				</view>
		</view>
		<view v-if="current==3">
			<view class="allone" v-for="item in baseInfoList">
				<view>
					<image :src="item.goodsPic" mode="" style="width: 240rpx; height: 210rpx;"></image>
				</view>
				<view class="ps">
					<p style="color:black;font-size:18px">{{item.goodsName}}</p>
					<p style="color:#999AAA;font-size:15px">下单时间：{{item.orderTime}}</p>
					<p style="color:#999AAA;font-size:15px">数量：*{{item.goodsNum}}</p>
					<p style="color:#999AAA;font-size:15px">总价：{{item.sumPrice}}</p>
				</view>
			</view>
		</view>
		<view v-if="current==4">
			<view class="allone" v-for="item in baseInfoList">
				<view>
					<image :src="item.goodsPic" mode="" style="width: 240rpx; height: 210rpx;"></image>
				</view>
				<view class="ps">
					<p style="color:black;font-size:18px">{{item.goodsName}}</p>
					<p style="color:#999AAA;font-size:15px">下单时间：{{item.orderTime}}</p>
					<p style="color:#999AAA;font-size:15px">数量：*{{item.goodsNum}}</p>
					<p style="color:#999AAA;font-size:15px">总价：{{item.sumPrice}}</p>
				</view>
			</view>
		</view>
		
		<view style="height: 100rpx; text-align: center;">
			<p style="margin-top: 40rpx; color: gray; font-size: 25rpx;">暂无更多</p>
		</view>
	</view>
</template>

<script>
import fuiTabs from "@/components/firstui/fui-tabs/fui-tabs.vue"


export default {
	components:{
		fuiTabs
	},
	data() {
		return {
				tabs: ['全部','未支付','未发货','已发货','已收货'],
				current:0,
				baseInfoList:[{
					userId:'',
					goodsName:'',
					orderTime:'',
					goodsNum:'',
					sumPrice:'',
					tab:1,
					goodsPic:'',
				}],
				allList:[],
				weishiyongorders:[{
					orderid:"1",
					price:"34元"
				},
				{
					orderid:"2",
					price:"34元"
				},
				{
					orderid:"3",
					price:"34元"
				},
				{
					orderid:"4",
					price:"34元"
				},
				{
					orderid:"5",
					price:"34元"
				},
				]
		}
	},
	onLoad()
	{
		this.init()
	},
	methods: {
		shouhuo(orderId){
			console.log("确认收获")
			this.request({
				url:'/base-info/updateTab',
				method:'GET',
				data:{
					orderId:orderId,
					tab:4
				}
			}).then(res=>{
				if(res.code=='1'){
					this.init()
					window.location.onLoad()
				}
			})
		},
		change(data){
			console.log(data.index)
			this.current=data.index
			if(data.index!=0){
				this.baseInfoList = this.allList.filter(item=>{
					return item.tab == data.index
				})
			}else{
				this.baseInfoList = this.allList
			}
			
		},
		init()
		{
			this.request(
			{
				url:"/base-info/list",
				method:"GET"
			}
			).then(res=>
			{
				if(res.code==='1')
				{
					console.log(res.data)
					this.baseInfoList = res.data
					this.allList = res.data
					for(var i = 0;i<this.baseInfoList.length;i++)
					{
						this.baseInfoList[i].orderTime = moment(value * 1000).format('YYYY-MM-DD HH:mm:ss')
					}
				}
				else
				{
					console.log("错误")
				}
			})
			
			
		}
	}
}
</script>
<style>
		.allone{
			background-color: #ffffff;
			height: 240rpx;
			width: 95%;
			margin-left: 20rpx;
			margin-top: 30rpx;
			display: flex;
			border-radius: 20rpx;
		}
		.allone view {
			margin-left: 24rpx;
			margin-top: 10rpx;
		}
		.ps p {
			margin-top: 7rpx;
		}
	
</style>